<template>
  <div>
    <!-- height="400px"
    max-height="400px"-->
    <el-table
      v-loading="listLoading"
      :data="tableData"
      :row-style="setRowStyle"
      :cell-style="setColumnStyle"
      :highlight-current-row="true"
      size="medium"
      row-class-name="row"
      cell-class-name="column"
      element-loading-text="Loading"
    >
      <slot name="first"/>
      <slot name="second"/>
      <slot name="third"/>
      <el-table-column
        v-for="(item, index) in tableLabel"
        :key="index"
        :prop="item.prop"
        :min-width="item.width"
        :label="item.label"
        :align="item.position"
      >
        <template slot-scope="scope">
          <el-button
            v-if="item.isOpera"
            type="text"
            size="small"
            @click="handleGoods(scope.row, $event)"
          >{{ scope.row[item.prop] }}
          </el-button>
          <div v-else>{{ scope.row[item.prop] }}</div>
        </template>
      </el-table-column>
      <slot name="isPro"/>
      <slot name="button"/>
    </el-table>
  </div>
</template>

<script>
  export default {
    props: {
      listLoading: {
        type: Boolean,
        default: false
      },
      tableData: {
        type: Array,
        default: () => {
          return []
        }
      },
      tableLabel: {
        type: Array,
        default: () => {
          return []
        }
      },
      setRowStyle: {
        type: Object,
        default: () => {
          return {}
        }
      },
      setColumnStyle: {
        type: Object,
        default: () => {
          return {}
        }
      }
    },
    methods: {}
  }
</script>
